/**
 * Element UI 兼容层
 * 允许使用Element UI语法但实际使用Element Plus
 */
import { getCurrentInstance } from 'vue'
import ElementPlus from 'element-plus'
import * as ElementPlusIcons from '@element-plus/icons-vue'
import 'element-plus/dist/index.css'

// 组件映射表
const componentMap = {
  // Element UI名称 => Element Plus名称
  'el-input': 'ElInput',
  'el-button': 'ElButton',
  'el-table': 'ElTable',
  'el-table-column': 'ElTableColumn',
  'el-form': 'ElForm',
  'el-form-item': 'ElFormItem',
  'el-dialog': 'ElDialog',
  'el-select': 'ElSelect',
  'el-option': 'ElOption',
  'el-date-picker': 'ElDatePicker',
  'el-pagination': 'ElPagination',
  'el-menu': 'ElMenu',
  'el-submenu': 'ElSubMenu',
  'el-menu-item': 'ElMenuItem',
  'el-dropdown': 'ElDropdown',
  'el-dropdown-menu': 'ElDropdownMenu',
  'el-dropdown-item': 'ElDropdownItem',
  'el-tabs': 'ElTabs',
  'el-tab-pane': 'ElTabPane',
  'el-radio': 'ElRadio',
  'el-radio-group': 'ElRadioGroup',
  'el-checkbox': 'ElCheckbox',
  'el-checkbox-group': 'ElCheckboxGroup',
  'el-switch': 'ElSwitch',
  'el-tooltip': 'ElTooltip',
  'el-tag': 'ElTag',
  'el-tree': 'ElTree',
  'el-upload': 'ElUpload',
  'el-row': 'ElRow',
  'el-col': 'ElCol',
  'el-card': 'ElCard',
  'el-popover': 'ElPopover',
  'el-alert': 'ElAlert'
}

// 方法映射
const $message = ElementPlus.ElMessage
const $notify = ElementPlus.ElNotification
const $msgbox = ElementPlus.ElMessageBox
const $alert = ElementPlus.ElMessageBox.alert
const $confirm = ElementPlus.ElMessageBox.confirm
const $prompt = ElementPlus.ElMessageBox.prompt
const $loading = ElementPlus.ElLoading.service

// 创建插件
const ElementBridge = {
  install(app) {
    // 注册Element Plus
    app.use(ElementPlus)

    // 注册所有图标组件
    for (const [key, component] of Object.entries(ElementPlusIcons)) {
      app.component(key, component)
    }

    // 添加兼容性组件别名
    for (const [elName, elPlusName] of Object.entries(componentMap)) {
      const elPlusComponent = ElementPlus[elPlusName]
      if (elPlusComponent) {
        app.component(elName, elPlusComponent)
      }
    }

    // 添加全局属性
    app.config.globalProperties.$ELEMENT = {
      size: 'default',
      zIndex: 2000
    }

    // 添加全局方法
    app.config.globalProperties.$message = $message
    app.config.globalProperties.$notify = $notify
    app.config.globalProperties.$msgbox = $msgbox
    app.config.globalProperties.$alert = $alert
    app.config.globalProperties.$confirm = $confirm
    app.config.globalProperties.$prompt = $prompt
    app.config.globalProperties.$loading = $loading
  }
}

// 导出插件
export default ElementBridge

// 导出兼容方法，供直接使用
export {
  $message,
  $notify,
  $msgbox,
  $alert,
  $confirm,
  $prompt,
  $loading
}
